<template>
    

  <div class="meituan-login">
    <input
      class="passname"
      style="border: none; color: #666"
      value="请输入手机号"
    />
    <div class="code">
      <a href="" style="color: #494949; margin-right: 0">获取验证码</a>
    </div>
    <!-- <br /> -->

    <input
      class="password"
      style="border: none; color: #666"
      value="手机验证码登录"
    />
    <p class="login">登录</p>

    <div class="registered">
      <div class="register-now">立即注册</div>
      <div class="retrieve-password">找回密码</div>
    </div>
    <div class="film-phone">
      <div class="telephone">@猫眼电影&nbsp;&nbsp;客服电话:</div>
      <div class="phone">13131319991</div>
    </div>
  </div>
</template>




<script>
import CenterTop from "../../components/CenterTop";

export default {
  data() {
    return {};
  },
  components: {
    CenterTop,
  },
  mounted() {},
};
</script>



<style type="text/scss" lang='scss' scoped>
.meituan-login {
  width: 100%;
  height: 600px;
  .passname {
    background: none;
    outline: none;
    border: none;
    width: 70%;
    height: 25px;
    margin-left: 15px;
    margin-top: 10px;
    font-size: 16px;
  }
  .code {
    width: 25%;
    height: 25px;
    background: #dcdcdc;
    margin-left: 269px;
    margin-top: -25px;
    border: 1px solid #dcdcdc;
    text-align: center;
    line-height: 25px;
    a {
      text-decoration: none;
    }
  }
  .passname:hover {
    background: rgb(240, 238, 238);
  }
  .password {
    background: none;
    outline: none;
    border: none;
    width: 90%;
    height: 25px;
    margin-left: 15px;
    margin-top: 5px;
    font-size: 16px;
  }
  .password:hover {
    background: rgb(240, 238, 238);
  }
  .login {
    width: 95%;
    height: 30px;
    background: #dcdcdc;
    margin-left: 8px;
    margin-top: 15px;
    text-align: center;
    line-height: 30px;
  }
  .registered {
    width: 100%;
    height: 50px;
    display: flex;
    .register-now {
      justify-content: space-between;
      width: 50%;
      height: 40px;
      margin-top: 15px;
      font-size: 13px;
      color: orange;
      margin-left: 15px;
    }
    .retrieve-password {
      justify-content: space-between;
      width: 50%;
      height: 40px;
      margin-top: 15px;
      font-size: 13px;
      text-align: right;
      margin-right: 15px;
      color: orange;
    }
  }
  .film-phone {
    display: flex;
    .telephone {
      justify-content: center;
      margin-left: 65px;
      font-size: 14px;
    }
    .phone {
      color: red;
      margin-top: 2px;
      margin-left: 5px;
    }
  }
}
// }
</style>
